<script setup>
import { onMounted, reactive, ref, computed, watch, nextTick, useSlots, inject } from 'vue';

defineOptions({ name: '' });
const props = defineProps({
  id: {required: true, type: String, default: ''},
  virtualRef: {required: true},
  trigger: {type: String, default: 'hover'},
  placement: {type: String, default: 'top'},
  width: {type: Number, default: 300},
  hideAfter: {type: Number, default: 300},
  showAfter: {type: Number, default: 100},
})
const emits = defineEmits(['on-ok']);
onMounted(() => {
  console.log('id', props.id);
  // console.log('myPopover', useSlots().mySlot ? true : false);
});

// 子组件暴露
defineExpose({});

const show = (event) => {
  console.log(event);
}


</script>

<template>
  <div>
    <el-popover virtual-triggering v-bind="props" @show="show">
      <div class="projectBox" ref="projectRef">
        我是气泡弹窗
      </div>
    </el-popover>
  </div>
</template>

<style lang="less" scoped></style>
